Like any kind of apps, JavaScript apps also have to be written well.
Otherwise, we run into all kinds of issues later on.
In this article, we’ll look at some tips we should follow to write JavaScript code faster and better.
Validating Emails
We can validate emails with a simple regex.
For instance, we can write:
const expression = /\S+@\S+/
expression.test('abc@example.com'.toLowerCase())
\S
stands for any non-whitespace character.
+
stands for at least one of the characters types preceding it.
@
is the ampersand sign.
This is a simple regex that can let us check for most email addresses.
We can use this without trouble.
Quotes
JavaScript allows 3 kinds of quotes.
We can write single quotes, double quotes, and backticks.
Single and double quotes are the same.
Backticks are for template strings.
JavaScript Classes
We can create classes, which are syntactic sugar for constructors.
For instance, we can write:
class Person {
constructor(name) {
this.name = name
}
greet() {
return `hi, ${this.name}`;
}
}
We have the Person
constructor.
It has the constructor
method to initialize the Person
instance.
greet
is a method that we can reference this
.
this
is the Person
instance.
So we can write:
const joe= new Person('joe');
console.log(joe.greet());
Then we get 'hi, joe'
logged in the console.
Class Inheritance
We can use the extends
keyword to inherit a parent class.
For instance, we can write:
class Student extends Person {
greet() {
return `Hi, ${this.name}. I am a student.`;
}
}
We have the Student
class that’s a subclass of Person
.
We have overridden the greet
method from Person
.
For instance, we can write:
const joe = new Person('joe');
console.log(joe.greet());
Then we’ll see:
'Hi, joe. I am a student.'
logged in the console.
Static Methods
Classes can have static methods.
We can write:
class Person {
static greet() {
return 'hi';
}
}
The method is shared among all instances of a class.
Then we can write:
Person.greet()
to call the method.
Getters and Setters
We can add getters and setters in a class.
For instance, we can write:
class Person {
constructor(name) {
this._name = name
}
set name(value) {
this._name = value
}
get name() {
return this._name
}
}
We have the _name
field, which we use the name
setter to set.
Setters are indicated with the set
keyword.
Getters are indicated with the get
keyword.
We can have a field that only has a getter.
For instance, we can write:
class Person {
constructor(name) {
this._name = name
}
get name() {
return this._name
}
}
Then we can only get the value of name
but not set it.
We can also have a field that only has a setter.
For instance, we can write:
class Person {
constructor(name) {
this._name = name
}
set name(value) {
this._name = value
}
}
Then we can only set name
but not get its value.
Getters and setters are handy for creating properties that are derived from other properties.
Exceptions
JavaScript code can throw exceptions like many programming languages.
It has the throw
keyword to let us throw exceptions.
For instance, we can write:
throw value
where value
can be any value.
Handling Exceptions
We can handle exceptions with the try-catch block.
For instance, we can write:
try {
// code that may throw exceptions
} catch (e) {
}
Then we can catch any exceptions that are thrown within the try block.
e
has the value that’s thrown by throw
.
The finally
block contain the code that’s executed regardless of the program flow.
We can use finally
without catch
.
It serves as a way to clean up any resources opened in the try
block.
try
blocks can be nested.
In this case, the nearest exception is handled.
For instance, we can write:
try {
// code
try {
// more code
} finally {
// more code
}
} catch (e) {
}
Conclusion
We can use getters and setters to get and set properties.
Also, we can throw and handle errors with exceptions.
JavaScript classes make inheritance easier. They’re equivalent to constructors.